
import 'package:flutter/material.dart';

class CustomIconButton extends StatefulWidget{

  const CustomIconButton({
    required this.onPressed,
    required this.image,
    this.alignment = Alignment.center,
    this.width = double.infinity,
    this.height = double.infinity,
  });

  final VoidCallback? onPressed;
  final ImageProvider image;
  final double width;
  final double height;
  final AlignmentGeometry alignment;

  @override
  State<StatefulWidget> createState() => _CustomIconButtonState();

}

class _CustomIconButtonState extends State<CustomIconButton>{

  double opacity = 1.0;

  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: widget.alignment,
      child: GestureDetector(
        child:Opacity(
          opacity: opacity,
          child:Image(image: widget.image,width: widget.width,height: widget.height,),
        ),
        onTapDown: (event){
          setState((){ opacity = 0.5; });
        },
        onTapUp: (event){
          Future.delayed(Duration(milliseconds: 200), () {
            setState((){ opacity = 1.0; });
          });
        },
        onTapCancel: (){
          setState((){ opacity = 1.0; });
        },
        onTap: widget.onPressed,
      ),
    );
  }
}

class CustomIconSwitch extends StatefulWidget{

  CustomIconSwitch({
    required this.onPressed,
    required this.image,
    this.width = double.infinity,
    this.height = double.infinity,
    required this.unselectImage,
    this.state = false,
    this.alignment = Alignment.center,
  });

  final ValueChanged<bool>? onPressed;
  final ImageProvider image;
  final double width;
  final double height;
  final ImageProvider unselectImage;
  final AlignmentGeometry alignment;
  final bool state;

  @override
  State<StatefulWidget> createState() => _CustomIconSwitchState();

}

class _CustomIconSwitchState extends State<CustomIconSwitch>{

  @override
  Widget build(BuildContext context) {
    return CustomIconButton(
      onPressed:(){
        widget.onPressed?.call(widget.state);
      },
      image: widget.state ? widget.image : widget.unselectImage,
      width: widget.width,
      height: widget.height,
      alignment:widget.alignment,
    );
  }
}

class CustomIconBackgroundSwitch extends StatefulWidget{

  CustomIconBackgroundSwitch({
    required this.onPressed,
    required this.image,
    this.width = double.infinity,
    this.height = double.infinity,
    required this.backImage,
    this.state = false,
    this.alignment = Alignment.center,
  });

  final ValueChanged<bool>? onPressed;
  final ImageProvider image;
  final double width;
  final double height;
  final ImageProvider backImage;
  final AlignmentGeometry alignment;
  final bool state;

  @override
  State<StatefulWidget> createState() {
    return _CustomIconBackgroundSwitchState();
  }

}

class _CustomIconBackgroundSwitchState extends State<CustomIconBackgroundSwitch>{

  double opacity = 1.0;

  @override
  Widget build(BuildContext context) {
    return  GestureDetector(
      child:Opacity(
        opacity: opacity,
        child:Stack(
            alignment: AlignmentDirectional.center,
            children: [
              Image(image: widget.image,width: widget.width,height: widget.height,),
              if(widget.state) Image(image: widget.backImage, width: widget.width, height: widget.height)
            ]
        ),
      ),
      onTapDown: (event){
        setState((){ opacity = 0.7; });
      },
      onTapUp: (event){
        Future.delayed(Duration(milliseconds: 200), () {
          setState((){ opacity = 1.0; });
        });
      },
      onTapCancel: (){
        setState((){ opacity = 1.0; });
      },
      onTap:(){ widget.onPressed?.call(!widget.state); },
    );
  }
}

